<template>
  <div>
    <div id="container">
      <router-view @getMsg='getVal'/>
    </div>

    <van-tabbar v-model="active">
      <van-tabbar-item icon="wap-home-o" to="/home">首页</van-tabbar-item>
      <van-tabbar-item icon="apps-o" to="/classify">分类</van-tabbar-item>
      <van-tabbar-item to="/publish">
        <van-icon name="add" slot='icon' class="zdy" />
        <span class="tzdy" to="/publishHuayu">发布</span>
      </van-tabbar-item>
      <van-tabbar-item icon="comment-o" to="/message">消息</van-tabbar-item>
      <van-tabbar-item icon="user-o" to="/mine">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
  export default {
    name: 'Index',
    data () {
      return {
        active:0,
        title:'首页'
      }
    },
		methods:{
			getVal(msg){
				this.active = msg.active;
			}
		}
  }
</script>

<style scoped>
  .zdy{
    color: #FE9BB0;
    position: relative;
    top: -15px;
    font-size: 48px;
    border: 2px solid #fff;
    border-radius: 50%;
  }
  .tzdy{
    position: relative;
    top: -17px;
  }
  .van-tabbar-item--active{
    color: #EFA2B2;
  }

  #container{
    margin-bottom: 50px;
  }
</style>
